@color_Waring: #ffc107;
@color_Danger: #fd397a;
@color_Success: #0abb87;
@color_Primary: #5578eb;
@color_Dark: #343a40;
@big_width: 114px!important;
@big_height: 43px!important;
@middle_width: 104px!important;
@middle_height: 34px!important;
@small_width: 91px!important;
@small_height: 29px!important;
button{
    background-color: white;
    border-radius: 5px!important;
    border-color:rgb(200,200,200)!important;
    height:34px!important;
    &:hover{
        color:black!important;
    }
}
.ant-btn {
    margin: 5px 10px;
}
.xxx_bigSize {
    width: @big_width;
    height: @big_height;
    
}

.xxx_middleSize {
    width: @middle_width;
    height: @middle_height;
    
}

.xxx_smallSize {
    width: @small_width;
    height: @small_height;
}
.xxx_noOutline {
    outline: none;
    color: #fff;
}
.noOutline {
    outline: none;
    
    border:none!important;
}

.xxx_showPage {
    background-color: rgb(240, 242, 245);
    height: auto;
}


.btn_grey{
    background-color: grey!important;
    color:black!important;
    .noOutline();
}
.btn_purple {
    color: #fff!important;
    background-color: rgb(181,3,255)!important;
    border-color: rgb(181,3,255)!important;
    .noOutline();
}
.btn_indigo {
    color: #fff!important;
    background-color: rgb(88,86,214)!important;
    border-color: rgb(88,86,214)!important;
    .noOutline();
}
.btn_primary {
    color: #fff!important;
    background-color: rgb(0,122,255)!important;
    border-color: rgb(0,122,255)!important;
    .noOutline();
}
.btn_info {
    color: #fff!important;
    background-color: rgb(90,200,250)!important;
    border-color: rgb(90,200,250)!important;
    .noOutline();
}
.btn_warning {
    color: black!important;
    background-color: rgb(255,204,0)!important;
    border-color: rgb(255,204,0)!important;
    .noOutline();
}
.btn_pink {
    color: #fff!important;
    background-color: rgb(255,45,85)!important;
    border-color: rgb(255,45,85)!important;
    .noOutline();
}
.btn_danger{
    color: #fff!important;
    background-color: rgb(255,59,48)!important;
    border-color: rgb(255,59,48)!important;
    .noOutline();
}
.btn_success {
    color: black!important;
    background-color: rgb(76,217,100)!important;
    border-color: rgb(76,217,100)!important;
    .noOutline();
}
.btn_green {
    color: #fff!important;
    background-color: rgb(76,217,100)!important;
    border-color: rgb(76,217,100)!important;
    .noOutline();
}
.btn_lime {
    color: #fff!important;
    background-color: rgb(187,226,68)!important;
    border-color: rgb(187,226,68)!important;
    .noOutline();
}
.btn_inverse {
    color: #fff!important;
    background-color: rgb(34,34,34)!important;
    border-color: rgb(34,34,34)!important;
    .noOutline();
}
// 卡片效果


//按钮效果
//普通效果
.xxx_button_background_Waring {
    background-color: @color_Waring;
    border-color: @color_Waring;         
    .xxx_noOutline();
    color: #111111;

    &:hover {
        background-color: #fbaa00;
        border-color: #eea200;
        text-decoration: none;
    }
}

.xxx_button_background_Danger {
    background-color: @color_Danger;
    border-color: @color_Danger;
    .xxx_noOutline();

    &:hover {
        background-color: #fd1361;
        border-color: #fc0758;
    }
}

.xxx_button_background_Success {
    background-color: @color_Success;
    border-color: @color_Success;
    .xxx_noOutline();

    &:hover {
        background-color: #08976d;
        border-color: #078b64;
    }
}

.xxx_button_background_Primary {
    background-color: @color_Primary;
    border-color: @color_Primary;
    .xxx_noOutline();

    &:hover {
        background-color: #384ad7;
        border-color: #2e40d4;
    }
}

.xxx_button_background_Dark {
    background-color: @color_Dark;
    border-color: @color_Dark;
    .xxx_noOutline();

    &:hover {
        background-color: #191a25;
        border-color: #14151d;
    }
}

.xxx_button_background_Error {
    background-color: rgb(220, 78, 65);
    border-color: rgb(220, 78, 65);
    .xxx_noOutline();

    &:hover {
        background-color: #d03526;
        border-color: #c63224;
    }
}

//内容空
.xxx_button_empty_Waring {
    &:hover {
        border-color: #eea200;
        color: #eea200;
    }
}

.xxx_button_empty_Danger {
    &:hover {
        border-color: #fc0758;
        color: #fc0758;
    }
}

.xxx_button_empty_Success {
    &:hover {
        border-color: #08976d;
        color: #08976d;
    }
}

.xxx_button_empty_Primary {
    &:hover {
        border-color: #384ad7;
        color: #384ad7;
    }
}

.xxx_button_empty_Dark {
    &:hover {
        border-color: #14151d;
        color: #14151d;
    }
}

.xxx_button_empty_Error {
    &:hover {
        border-color: rgb(220, 78, 65);
        color: rgb(220, 78, 65);
    }
}

//文字有颜色，背景变化
.xxx_button_text_Waring {
    background-color: rgba(255, 291, 6, .2);
    color: #eea200;
    border-color: rgba(255, 291, 6, .2);
    ;

    &:hover {
        border-color: #fbaa00;
        ;
        background-color: #eea200;
        color: rgb(240, 242, 245);
    }
}

.xxx_button_text_Danger {
    background-color: rgba(255, 291, 6, .2);
    color: #fc0758;
    border-color: rgba(255, 291, 6, .2);

    &:hover {
        border-color: #fbaa00;
        ;
        background-color: #eea200;
        color: rgb(240, 242, 245);
    }
}

.xxx_button_text_Success {
    background-color: rgba(10, 187, 135, 0.2);
    color: #08976d;
    border-color: rgba(10, 187, 135, 0.2);

    &:hover {
        border-color: rgb(10, 187, 135, );
        background-color: rgb(10, 187, 135, );
        color: rgb(240, 242, 245);
    }
}

.xxx_button_text_Primary {
    background-color: rgba(24, 144, 255, .2);
    color: #384ad7;
    border-color: rgba(24, 144, 255, .2);

    &:hover {
        border-color: rgb(24, 144, 255, );
        background-color: rgb(24, 144, 255, );
        color: rgb(240, 242, 245);
    }
}

.xxx_button_text_Dark {
    background-color: rgba(75, 60, 14, .2);
    color: #14151d;
    border-color: rgba(75, 60, 14, .2);

    &:hover {
        border-color: rgb(75, 60, 14, );
        background-color: rgb(75, 60, 14, );
        color: rgb(240, 242, 245);
    }
}

.xxx_button_text_Error {
    background-color: rgba(220, 78, 65, .2);
    color: #14151d;
    border-color: rgba(220, 78, 65, .2);

    &:hover {
        border-color: rgb(220, 78, 65);
        background-color: rgb(220, 78, 65);
        color: rgb(240, 242, 245);
    }
}

//亮丽
.xxx_light_Primary {
    color: #fff;
    background-color: #2a4eff;
    border-color: #1d43ff;
}

.xxx_light_Dark {
    color: #fff;
    background-color: #14151d;
    border-color: #0f0f16;
}

.xxx_light_Danger {
    color: #fff;
    background-color: #fd397a;
    border-color: #fd397a;
}
.xxx_light_Success {
    color: #fff;
    background-color: rgb(10, 187, 135, );
    border-color: rgb(10, 187, 135, );
}
.xxx_light_Waring{
    color: #fff;
    background-color: #fbaa00;
    border-color: #fbaa00;
}